<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>laya</title>
	<link rel="stylesheet" href="./style/reset.css" />
	<link rel="stylesheet" href="./style/common.css" />
	<link rel="stylesheet" href="./style/index.css" />
	<link rel="stylesheet" type="text/css" href="style/animate.css">
</head>
<body>
<!-- 头部 -->
	<div class="header">
		<div class="container">
			<div class="header_box">
					<a href="#" class="logo"><img src="./images/header_logo-bg.png"/></a>
					<input type="checkbox" id="mobile"/>
					<label class="mobile_box" for="mobile">
						<span></span>
						<span></span>
						<span></span>
					</label>		
					<div class="nav">
						<a href="index.html">首页</a>
						<a href="family.html">Laya家族</a>
						<a href="game.html">游戏</a>
						<a href="news.htm">新闻动态</a>
						<a href="#">开发者中心</a>
						<a href="#">开发者社区</a>
						<a href="#">开放平台</a>
						<a href="about.html">关于我们</a>
						<div class="lang">
						<input type="checkbox" id="lang_checked"/>
						<label for="lang_checked" class="arrow"><span>language</span>
							<ul>
							<li>English</li>
							<li>中文</li>
						</ul>
						</label>
						
					</div>
					
									
				</div>
					
				
			</div>
		</div>
	</div>
<!-- 轮播图 -->
	<div class="banner">
	<img src="./images/banner.png"/>
	</div>
<!-- flash -->
	<div class="flash">
		<div class="container">
		<div class="flash_wrapper">
			<div class="flash_box  wow rotateOut">
				<h2>LayaFlash 引擎</h2>
				<p>让Flash技术变成开发HTML5产品的利器</p>
				<div class="flash_flex">
					<div class="flash_content">
						<div class="flash_img">
							<img src="./images/flash-pic1.png"/>
						</div>
						<h3>快速Flash产品转换</h3>
						<p>Flash页游\手游仅需1个人7天即可
                        转换为HTML5和APP游戏</p>
					</div>
					<div class="flash_content">
						<div class="flash_img">
							<img src="./images/flash-pic2.png"/>
						</div>
						<h3>LayaFlash IDE</h3>
						<p>支持代码编译、调试、压缩与混淆
                        加密、资源转换、在线文档等功能</p>
					</div>
					<div class="flash_content">
						<div class="flash_img">
							<img src="./images/flash-pic3.png"/>
						</div>
						<h3>HTML5零学习成本</h3>
						<p>AS3开发者可直接使用Flash开源框
                        架和工具链进行开发HTML5</p>
					</div>
					<div class="flash_content">
						<div class="flash_img">
							<img src="./images/flash-pic4.png"/>
						</div>
						<h3>性能媲美APP</h3>
						<p>LayaFlash引擎的重度游戏已运行于
                        QQ空间等平台，性能媲美APP</p>
					</div>
					
				</div>
			</div>
		</div>
		</div>
	</div>
<!-- advant -->
	<div class="advant">
		<div class="container">
			<div class="advant_box  wow bounceIn">
				<div class="advant_content">
					<div class="advant_title">Layabox 优势</div>
					<div class="list">
						<ul>
							<li><p>快速上手，Flash程序员3小时掌握HTML5开发</p></li>
							<li><p>4年优化打磨，LayaPlayer运行器性能媲美APP</p></li>
							<li><p>超5亿的LayaPlayer移动设备安装量帮助CP发行</p></li>
							<li><p>使用LayaFlash开发大型HTML5游戏的企业超100家</p></li>
						</ul>
					</div>
				</div>
			</div>
		</div>
	</div>
<!-- product -->
	<div class="product">
		<div class="container">
			<div class="product_box">
				<div class="product_content">
					<h2>Layabox产品家族</h2>
					<div class="product_flex">
						<div class="flex_box  wow rotateInDownRight">
							<div class="img"><img src="./images/prodct_img.png"/></div>
							<div class="text">
							<h3>LayaAir</h3>
							<p>核心库仅100K左右的新一代HTML5引擎，支
							持AS3\TS\JS语言开发，支持2D\3D，非运行
							器模式下性能媲美APP。</p>
							</div>
							
						</div>
						<div class="flex_box   wow rotateInDownRight">
							<div class="img"><img src="./images/prodct_img.png"/></div>
							<div class="text">
							<h3>LayaAir</h3>
							<p>核心库仅100K左右的新一代HTML5引擎，支
							持AS3\TS\JS语言开发，支持2D\3D，非运行
							器模式下性能媲美APP。</p>
							</div>
							
						</div>
						<div class="flex_box   wow rotateInDownRight">
							<div class="img"><img src="./images/prodct_img.png"/></div>
							<div class="text">
							<h3>LayaAir</h3>
							<p>核心库仅100K左右的新一代HTML5引擎，支
							持AS3\TS\JS语言开发，支持2D\3D，非运行
							器模式下性能媲美APP。</p>
							</div>
							
						</div>
						<div class="flex_box  wow rotateInDownRight">
							<div class="img"><img src="./images/prodct_img.png"/></div>
							<div class="text">
							<h3>LayaAir</h3>
							<p>核心库仅100K左右的新一代HTML5引擎，支
							持AS3\TS\JS语言开发，支持2D\3D，非运行
							器模式下性能媲美APP。</p>
							</div>
							
						</div>
						<div class="flex_box  wow rotateInDownRight">
							<div class="img"><img src="./images/prodct_img.png"/></div>
							<div class="text">
							<h3>LayaAir</h3>
							<p>核心库仅100K左右的新一代HTML5引擎，支
							持AS3\TS\JS语言开发，支持2D\3D，非运行
							器模式下性能媲美APP。</p>
							</div>
							
						</div>
						<div class="flex_box   wow rotateInDownRight">
							<div class="img"><img src="./images/prodct_img.png"/></div>
							<div class="text">
							<h3>LayaAir</h3>
							<p>核心库仅100K左右的新一代HTML5引擎，支
							持AS3\TS\JS语言开发，支持2D\3D，非运行
							器模式下性能媲美APP。</p>
							</div>
							
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
<!-- game -->
	<div class="game">
		<div class="container">
			<div class="game_box  wow hinge">
				<div class="game_content">
					<div class="game_title">
						<h2>采用Layabox引擎的精彩游戏</h2>
						<div class="game_more"><a href="#">更多</a></div>
					</div>
					
					<div class="video">
						<video controls poster="./images/video.png">
     						<source src="./images/video/layabox_product.mp4" type="video/mp4">
   							您的浏览器不支持 video 标签。
						</video>
						<div class="video_flex">
							<div class="flex_box">
								<div class="video_img">
									<img src="./images/product_img1.png"/>
								</div>
								<h4>猎刃2</h4>
							</div>
							<div class="flex_box">
								<div class="video_img">
									<img src="./images/product_img1.png"/>
								</div>
								<h4>猎刃2</h4>
							</div>
							<div class="flex_box">
								<div class="video_img">
									<img src="./images/product_img1.png"/>
								</div>
								<h4>猎刃2</h4>
							</div>
							<div class="flex_box">
								<div class="video_img">
									<img src="./images/product_img1.png"/>
								</div>
								<h4>猎刃2</h4>
							</div>
							<div class="flex_box">
								<div class="video_img">
									<img src="./images/product_img1.png"/>
								</div>
								<h4>猎刃2</h4>
							</div>
							<div class="flex_box">
								<div class="video_img">
									<img src="./images/product_img1.png"/>
								</div>
								<h4>猎刃2</h4>
							</div>
							<div class="flex_box">
								<div class="video_img">
									<img src="./images/product_img1.png"/>
								</div>
								<h4>猎刃2</h4>
							</div>
							<div class="flex_box">
								<div class="video_img">
									<img src="./images/product_img1.png"/>
								</div>
								<h4>猎刃2</h4>
							</div>
							<div class="flex_box">
								<div class="video_img">
									<img src="./images/product_img1.png"/>
								</div>
								<h4>猎刃2</h4>
							</div>
							<div class="flex_box">
								<div class="video_img">
									<img src="./images/product_img1.png"/>
								</div>
								<h4>猎刃2</h4>
							</div>
							<div class="flex_box">
								<div class="video_img">
									<img src="./images/product_img1.png"/>
								</div>
								<h4>猎刃2</h4>
							</div>
							<div class="flex_box">
								<div class="video_img">
									<img src="./images/product_img1.png"/>
								</div>
								<h4>猎刃2</h4>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
<!-- partner -->
	<div class="partner">
		<div class="container">
			<div class="partner_box">
				<div class="partner_content">
					<div class="partner_title">
						<h2>合作伙伴<span>(排序不分先后)</span></h2>
					</div>
					<div class="partner_flex">
						<div class="flex_box">
							<a class="partner_img">
								<img src="./images/partner-qzone.png"/>
							</a>
						</div>
						<div class="flex_box">
							<a class="partner_img">
								<img src="./images/partner-qzone.png"/>
							</a>
						</div>
						<div class="flex_box">
							<a class="partner_img">
								<img src="./images/partner-qzone.png"/>
							</a>
						</div>
						<div class="flex_box">
							<a class="partner_img">
								<img src="./images/partner-qzone.png"/>
							</a>
						</div>
						<div class="flex_box">
							<a class="partner_img">
								<img src="./images/partner-qzone.png"/>
							</a>
						</div>
						<div class="flex_box">
							<a class="partner_img">
								<img src="./images/partner-qzone.png"/>
							</a>
						</div>
						<div class="flex_box">
							<a class="partner_img">
								<img src="./images/partner-qzone.png"/>
							</a>
						</div>
						<div class="flex_box">
							<a class="partner_img">
								<img src="./images/partner-qzone.png"/>
							</a>
						</div>
						<div class="flex_box">
							<a class="partner_img">
								<img src="./images/partner-qzone.png"/>
							</a>
						</div>
						<div class="flex_box">
							<a class="partner_img">
								<img src="./images/partner-qzone.png"/>
							</a>
						</div>
						<div class="flex_box">
							<a class="partner_img">
								<img src="./images/partner-qzone.png"/>
							</a>
						</div>
						<div class="flex_box">
							<a class="partner_img">
								<img src="./images/partner-qzone.png"/>
							</a>
						</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
<!-- foot -->
	<div class="foot">
		<div class="container">
			<div class="foot_box">
				<div class="foot_content">
					<a href="#">公司简介</a>
					<a href="#">联系方式</a>
					<a href="#">人才招聘</a>
					<span>All Copyright Reserved by Layabox Inc. 京ICP备15008163号-1</span>
				</div>
				<div class=foot_contact>
						<a href="#"><img src="./images/foot_letter.png" />
							<div class="letter">
								<img src="./images/foot_map.png">
							</div>
						</a>
						<a href="#"><img src="./images/foot_wechat.png" />
							<div class="letter">
							<img src="./images/foot_map.png">
						</div>
						</a>				
						<a href="#"><img src="./images/foot_qq.png" />
							<div class="letter">
								<img src="./images/foot_map.png">
							</div>	
						</a>
				</div>
			</div>
		</div>
	</div>
</body>
 <script src="js/wow.min.js"></script>
        <script>
            new WOW().init();
        </script>
</html>